<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<link rel="stylesheet" type="text/css" href="/static/shop/mobile/css/style.css"/>
	<style>
		body{
			width: 100%;
			height: 100vh;
			background: #ebebeb;
			overflow: hidden;
			font-family: "微软雅黑";
		}
		.login_big{
			width: 16rem;
			line-height: 1rem;
			overflow: hidden;
			margin: 0 auto;
			margin-top: 5rem;
		}
		.login_big input{
			width: 100%;
			height:  3rem;
			padding-left: 1rem;
			box-sizing: border-box;
			border: none;
			background: #FFFFFF;
			color: #000000;
			font-size: .8rem;
			border-radius: 0.25rem;
			margin-top: 1rem;
		}
		.code{
			position: relative;
			overflow: hidden;
		}
		.codeClick{
			width: 5.225rem;
			height: 1.675rem;
			background: #231916;
			color: #FFFFFF;
			border-radius: 0.25rem;
			position: absolute;
			right: .8rem;
			top: 1.6rem;
			text-align: center;
			line-height: 1.675rem;
			font-size: .8rem;
		}
		.details{
			width: 100%;
			height: 3.15rem;
			background: #231916;
			color: #FFFFFF;
			font-size: 1rem;
			text-align: center;
			line-height: 3.15rem;
			margin-top: 1rem;
			border-radius: .25rem;
		}
		.look{
			font-size: .8rem;
			color: #231916;
			text-align: center;
			margin-top: 1rem;
		}
	</style>
	<body>
		<div class="login_big">
			<input type="text"  id="phone" placeholder="请输入手机号码"/>
			<div class="code">
				<input type="text" id="code" placeholder="请输入验证码" />
				<div class="codeClick" id="getcode" >发送验证码</div>
			</div>
			<input type="password" id="password" placeholder="请输入密码"/>
			<input type="password" id="repassword" placeholder="确认密码"/>
			<!-- <input type="text" placeholder="请输入邮箱号"/> -->
			<div class="details" id="submit">注&nbsp;&nbsp;册</div>
			<div class="details" id="submit"><a href="{:url('/')}" style="color:#fff;">返回首页</a></div>
			<p class="look">我已阅读并同意<a href="{:url('shop/login/read')}">《释艺网用户协议》</a></p>
		</div>
	</body>
	<script src="__MODULE_JS__/jquery-1.11.3.min.js"></script>
	<script>
		/*var timer = 60
		$('.codeClick').click(function(){
			tim = setInterval(() =>{
				timer--
				$(this).html(timer+'S')
				console.log(timer)
				if(timer <= 0){
					clearInterval(tim)
					timer = 60
					$(this).html('重新发送')
				}
			},1000)
		})*/
		$(function() {
		var countdown=120; 

		$('#submit').click(function(){
				var phone = $('#phone').val();
				var code = $('#code').val();
				var password = $('#password').val();
				var repassword = $('#repassword').val();
				if( phone == '' || phone.match(/^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/) == null){
					alert('手机号格式不正确');return false;
				}else if(code == ''){
					alert('验证码不能为空');return false;
				}else if(password != repassword || password == ''){
					alert('两次密码输入不一致');return false;
				}

				if(code != ''){
					$.post("{:url('shop/login/getcode')}",{phone:phone, code:code},function(res){
							if(res.code != 0){
								alert(res.msg);return false;
							}else{
								//验证成功 提交注册
								$.post("{:url('shop/login/register')}", {phone:phone, code:code, password:password}, function(obj){
										if(obj.code == 0){
											alert(obj.msg);
											window.location.href = "{:url('shop/login/index')}";
										}else{
											alert(obj.msg);
										}
								},'json')
							}
					})
				}
		});
var send = 0;
		$('#getcode').click(function(){
		    	if(send) return ;
				var phone = $("#phone").val();
				if(phone == ''){
					alert('请输入手机号'); return false;
				}
				$.get("{:url('shop/login/sendcode')}",{'phone': phone},function(ev){
					//倒计时
					if(ev){
					    alert('发送成功');
					    send =1;
                        $('#getcode').text('已发送');
					}
				});
		});

		function settime(obj) { //发送验证码倒计时
		    if (countdown == 0) { 
		        obj.attr('disabled',false); 
		        //obj.removeattr("disabled"); 
		        obj.val("免费获取验证码");
		        countdown = 60; 
		        return;
		    } else { 
		        obj.attr('disabled',true);
		        obj.val("重新发送(" + countdown + ")");
		        countdown--; 
		    } 
			setTimeout(function() { 
		    settime(obj) }
		    ,1000) 
		}
	});
	</script>
</html>
